﻿@model haunstm_test_mvc_json.Models.Person
@{
    ViewBag.Title = "PersonNiklasInfo";
}

<h2>PersonNiklasInfo</h2>

<table class="data">
    <thead>
        <tr>
            <td>Press button</td><td>Result</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><button id="btnFetchJSON">Fetch Json</button></td><td id="result">Nothing yet!</td>
        </tr>
    </tbody>
</table>

@section scripts{
    <script type="text/javascript">
        $("#btnFetchJSON").click(function() {
            $.ajax({
                type: "POST",
                url: "@Url.Action("JSONPersonObject")",
                dataType: 'json',
                data: "Name=Hej",
                success: function(jsonDataResult) {
                    
                        $("#result").append('<h3>Name:</h3>');
                        $("#result").append('<p>FirstName: '+ jsonDataResult.FirstName +'</p>');
                        $("#result").append('<p>LastName: '+ jsonDataResult.LastName +'</p>');
                    
                        $("#result").append('<h3>Addresses:</h3>');
                        // this is where we can loop through the results in the json object
                        $.each(jsonDataResult.Addresses,function(i){
                            $("#result").append('<p>City: '+ jsonDataResult.Addresses[i].City +'</p>');
                            $("#result").append('<p>Line1: '+ jsonDataResult.Addresses[i].Line1 +'</p>');
                            $("#result").append('<p>Line2: '+ jsonDataResult.Addresses[i].Line2 +'</p>');
                            $("#result").append('<p>ZipCode: '+ jsonDataResult.Addresses[i].ZipCode +'</p>');
                            $("#result").append('<p>State: '+ jsonDataResult.Addresses[i].State +'</p>');
                            $("#result").append('<p>Country: '+ jsonDataResult.Addresses[i].Country +'</p>');
                        });
                },
                error: function(errorMsg) {
                    alert('Uncaught Error.\n' + errorMsg.responseText);
                }
            });
        });
    </script>
    }
